<%@ page contentType="text/html;charset=UTF-8" language="java" %>


<%
    String path = request.getContextPath();
    String basepath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + "/" + path + "/";
%>

<html>
<body>

</body>
<head>
    <base href="<%=basepath%>">


    <title>Title</title>
    <%--引入css样式--%>
    <link rel="stylesheet" href="lib/zTree/v3/css/zTreeStyle/zTreeStyle.css" type="text/css">

</head>


<%--引入js文件--%>
<script type="text/javascript" src="lib/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="lib/zTree/v3/js/jquery.ztree.all-3.5.min.js"></script>


<button onclick="getCheckedData();">获取选中的节点数据</button>


<%--zTree的列表--%>
<ul id="permissionTree" class="ztree"></ul>
<script type="text/javascript">

    /*Tree的初始化对象,*/
    var setting = {
        data: {
            /*设置支持简单数据*/
            simpleData: {
                enable: true,
                idKey: "permissionId",
                pIdKey: "parentId"

            }
        },
        /*设置支持复选框*/
        check: {
            enable: true
        },
        /*开启支持异步加载数据*/
        async: {
            enable: true,
            url: "permission/getAllPermission.do",
            //对ajax返回的数据进行预处理数据
            dataFilter: ajaxDataFilter
        },
        /*异步回调函数*/
        callback: {
            /*异步加载成功回调函数*/
            onAsyncSuccess: zTreeOnAsyncSuccess
        }
    };

    /*异步加载成功回调函数*/
    function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) {
        /*
        * 将zTree数据回写思路
        * 1.获取Ids
        * 2.转化成数据循环
        * 3.获取树对象,对特定ID的属性设为true
        * */
        var permissionId="58,31,35,32,33,34";

        var permissionIdsArr=permissionId.split(",");

        //获取树
        var treeObj = $.fn.zTree.getZTreeObj("permissionTree");

        for (var i = 0; i < permissionIdsArr.length; i++) {

            var Id=permissionIdsArr[i];
            var nodes = treeObj.getNodeByParam("permissionId", Id, null);

            console.log(nodes)

            //让其对应节点选中
            treeObj.checkNode(nodes, true, false);


        }

    };



    /*预处理过滤函数*/
    function ajaxDataFilter(treeId, parentNode, responseData) {
        if (responseData) {
            for (var i = 0; i < responseData.length; i++) {

                /*清空所有URL地址，防止跳转*/
                responseData[i].url = null;
                /*将所有目录展开*/
                responseData[i].open = true;


            }
        }
        return responseData;
    };


    /*初始化zTree*/
    $(function () {
        $.fn.zTree.init($("#permissionTree"), setting);
    });


    /*获取选中节点的数据*/
    function getCheckedData() {
        /*获取zTree树对象 ：没有#不是Jquery ID选择器 */
        var treeObj = $.fn.zTree.getZTreeObj("permissionTree");
        /*获取选中的节点*/
        var nodes = treeObj.getCheckedNodes(true);



        //用于声明数组
        var permissionIds=[];

        //循环节点
        for (var i = 0; i < nodes.length;i++) {

            var node=nodes[i];
            permissionIds.push(node.permissionId);

        }
        console.log(permissionIds);
        console.log(permissionIds.toString());
    }


</script>


</html>
